<template>
  <div class="app-main-container">
    <div class="doumee-filter">
      <el-form inline @submit.native.prevent>
        <el-form-item label="设备号:">
          <el-input v-model="filters.mac" placeholder="输入设备号" clearable />
        </el-form-item>
        <el-form-item label="线路开关状态:">
          <el-select v-model="filters.status" placeholder="选择线路开关状态" clearable>
            <el-option
              v-for="item in openStatus"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button v-preventReClick type="primary" @click="getList(1)">查找</el-button>
          <el-button v-preventReClick @click="clearList">清空</el-button>
        </el-form-item>
      </el-form>
    </div>
    <el-tabs v-model="active" @tab-click="handleClick">
      <el-tab-pane v-for="(tab, i) in tabList" :key="tab.id" :label="tab.manufacturer" :name="i.toString()">
        <div class="doumee-filter manufacturer">
          <div>
            <el-button type="danger" @click="yjgd">一键关灯</el-button>
            <el-button type="success" @click="showDsBtn">定时</el-button>
            <el-button type="info" @click="showZhpzBtn">账号配置</el-button>
            <el-button type="warning" @click="showGzpzBtn">规则配置</el-button>
            <el-button type="primary" @click="tbBtn">同步</el-button>
          </div>
          <div class="detail" @click="manufacturerDetail"><i class="el-icon-warning-outline" /> 厂商说明</div>
        </div>
        <el-table
          ref="table"
          v-loading="listLoading"
          :data="list"
          element-loading-text="Loading"
          border
          fit
          :header-row-class-name="'table-header'"
          class="doumee-element-tableb"
        >
          <el-table-column
            align="center"
            label="设备号"
            prop="lightId"
            show-overflow-tooltip
            min-width="260"
          />
          <el-table-column
            align="center"
            label="设备别名"
            prop="aliasName"
            show-overflow-tooltip
            min-width="200"
          />
          <el-table-column
            align="center"
            label="线路"
            prop="title"
            show-overflow-tooltip
            min-width="200"
          />
          <el-table-column
            align="center"
            label="设备位置"
            prop="addres"
            show-overflow-tooltip
            min-width="260"
          />
          <el-table-column
            align="center"
            label="关联场区"
            prop="associatedField"
            show-overflow-tooltip
            min-width="200"
          />
          <el-table-column
            align="center"
            label="关联场地"
            prop="associatedPlace"
            show-overflow-tooltip
            min-width="200"
          />
          <el-table-column fixed="right" align="center" label="状态" min-width="120">
            <template slot-scope="scope">
              <el-switch
                v-model="scope.row.oc"
                active-value="true"
                inactive-value="false"
                @change="toConfigUpdate($event, scope.row)"
              />
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" min-width="200" fixed="right">
            <template slot-scope="scope">
              <div class="flex-cc">
                <el-button v-if="functors && functors[0] == '1'" v-preventReClick type="text" @click="showTimeBtn(scope.row)">查看定时</el-button>
                <el-button v-if="functors && functors[1] == '1'" v-preventReClick type="text" @click="showCqcdBtn(scope.row)">绑定场区场地</el-button>
              </div>
            </template>
          </el-table-column>
        </el-table>
        <!-- <div class="flex-cc doumee-pagination">
          <el-pagination
            background
            hide-on-single-page
            layout="prev, pager, next"
            :current-page.sync="pagination.page"
            :total="total"
            @current-change="getList"
          />
        </div> -->
        <Paginations
          :total="total"
          :page="pagination.page"
          @current-change="getList"
          @SizeChange="handleSizeChange"
        />
      </el-tab-pane>
    </el-tabs>
    <el-dialog
      title="账号配置"
      :close-on-click-modal="modalDialog"
      :close-on-press-escape="modalDialog"
      :visible.sync="showZhpz"
    >
      <el-form ref="ruleForm" :model="form" :rules="rules" label-width="120px">
        <el-form-item label="设备厂商：" prop="facturerId">
          <el-select v-model="form.facturerId" placeholder="请选择设备厂商">
            <el-option
              v-for="item in tabList"
              :key="item.id"
              :label="item.manufacturer"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item v-if="form.facturerId == '15'" label="资产id" :required="form.facturerId == '15'">
          <el-input v-model="form.assetId" placeholder="请输入资产id" />
        </el-form-item>
        <el-form-item v-if="form.facturerId == '6'" label="projectCode：" prop="projectCode">
          <el-input v-model="form.projectCode" placeholder="请输入projectCode" />
        </el-form-item>
        <!-- <el-form-item label="用户账号：" prop="account">
          <el-input v-model="form.account" placeholder="请输入用户账号" />
        </el-form-item>
        <el-form-item label="密码：" prop="passwd">
          <el-input v-model="form.passwd" placeholder="请输入密码" type="password" />
        </el-form-item>
        <el-form-item label="AppKey：" prop="appKey">
          <el-input v-model="form.appKey" placeholder="请输入AppKey" />
        </el-form-item>
        <el-form-item label="AppSecret：" prop="appSecret">
          <el-input v-model="form.appSecret" placeholder="请输入AppSecret" />
        </el-form-item>
        <el-form-item label="redirectUrl：" prop="redirectUrl">
          <el-input v-model="form.redirectUrl" placeholder="请输入redirectUrl" />
        </el-form-item> -->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="showZhpz = false">取消</el-button>
        <el-button v-preventReClick :loading="subLoading" type="primary" @click="onSubmit">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog
      title="规则配置"
      :visible.sync="showGZPZ"
      :close-on-click-modal="modalDialog"
      :close-on-press-escape="modalDialog"
      width="810px"
    >
      <div class="warnningTip"><span><i class="el-icon-warning-outline" />
        如果配置开灯/关灯时间，系统会根据订单时间自动开关灯，设置之后，开灯时间会提前，关灯时间会延迟;特殊时间配置，场区不选则表示适用于全部场区；</span></div>
      <el-form ref="ruleFormb" :model="gzpz" :rules="ruleb" label-width="8em">
        <el-form-item label="核销入场开灯：" prop="isOpen">
          <el-switch
            v-model="gzpz.isOpen"
            active-value="1"
            inactive-value="0"
          />
          <span class="tip-style">开启后，有灯控的场地，在核销入场时，系统会自动打开场地灯光</span>
        </el-form-item>
        <el-form-item label="开灯：" prop="kd">
          <el-input v-model="gzpz.kd" oninput="value=value.replace(/[^\d]/g,'')" style="width: 100px;" maxlength="5" />
          <span class="margin-l-10">分钟</span>
          <span class="tip-style">配置开灯提前时间，默认0表示不延迟，到时间立刻开灯</span>
        </el-form-item>
        <el-form-item label="关灯：" prop="gd">
          <el-input v-model="gzpz.gd" oninput="value=value.replace(/[^\d]/g,'')" style="width: 100px;" maxlength="5" />
          <span class="margin-l-10">分钟</span>
          <span class="tip-style">配置关灯延后时间，默认0表示不延迟，到时间立刻关灯</span>
        </el-form-item>
        <el-form-item label="特殊时间：">
          <div class="tip-style noLeft">配置的时间段内，灯光不随变化</div>
          <div v-for="(em, dex) in tsList" :key="dex" class="tsPz">
            <el-select
              v-model="em.areaId"
              placeholder="请选择场区"
              style="width: 200px"
              clearable
            >
              <el-option
                v-for="item in cqList"
                :key="item.id"
                :label="item.areaName"
                :value="item.id"
              />
            </el-select>
            <el-time-picker
              v-model="em.time"
              class="margin-l-10"
              style="width: 360px;"
              is-range
              value-format="HH:mm"
              format="HH:mm"
              range-separator="至"
              start-placeholder="开始时刻"
              end-placeholder="结束时刻"
            />
            <span class="red pointer margin-l-10" @click="delBtn(dex)">删除</span>
          </div>
          <div class="addBtn" @click="tsList.push({})">添加</div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="showGZPZ = false">取消</el-button>
        <el-button v-preventReClick :loading="subLoading" type="primary" @click="onSubmitb">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog
      title="定时"
      :close-on-click-modal="modalDialog"
      :close-on-press-escape="modalDialog"
      :visible.sync="showDs"
    >
      <el-form ref="ruleFormc" :model="ds" :rules="rulec" label-width="100px">
        <el-form-item label="设备：" prop="macId">
          <el-select
            v-model="ds.macId"
            style="width: 100%"
            placeholder="请选择设备"
            @change="sbChange"
          >
            <el-option
              v-for="item in sbList"
              :key="item.id"
              :label="item.devName"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="设备线路：" prop="lineId">
          <el-select
            v-model="ds.lineId"
            multiple
            style="width: 100%"
            placeholder="请选择线路，多选"
          >
            <el-option
              v-for="item in xlList"
              :key="item.lineId"
              :label="item.lineName"
              :value="item.lineId"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="灯控状态：" prop="status">
          <el-radio-group v-model="ds.status">
            <el-radio label="true">开灯</el-radio>
            <el-radio label="false">关灯</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="循环周期：" prop="week">
          <el-checkbox-group v-model="ds.week" @change="handleCheckAllChange">
            <el-checkbox label="一">周一</el-checkbox>
            <el-checkbox label="二">周二</el-checkbox>
            <el-checkbox label="三">周三</el-checkbox>
            <el-checkbox label="四">周四</el-checkbox>
            <el-checkbox label="五">周五</el-checkbox>
            <el-checkbox label="六">周六</el-checkbox>
            <el-checkbox label="日">周日</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="开关时间：" prop="time">
          <el-time-picker
            v-if="ds.week.length > 0"
            v-model="ds.time"
            format="HH:mm:ss"
            value-format="HH:mm:ss"
            placeholder="选择时间"
          />
          <el-date-picker
            v-else
            v-model="ds.time"
            type="datetime"
            placeholder="选择日期时间"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            :picker-options="pickerOptions"
          />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="showDs = false">取消</el-button>
        <el-button v-preventReClick :loading="subLoading" type="primary" @click="onSubmitc">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog
      title="绑定场区场地"
      :close-on-click-modal="modalDialog"
      :close-on-press-escape="modalDialog"
      :visible.sync="showCqcd"
    >
      <el-form ref="ruleFormcq" :model="cqcqObj">
        <template v-for="(item, index) in cqcd">
          <el-form-item :key="index" label="场区场地：">
            <el-col :span="8">
              <el-input v-model="item.fieldName" readonly />
            </el-col>
            <el-col class="line" :span="1" style="text-align: center">-</el-col>
            <el-col :span="8">
              <el-input v-model="item.placeName" readonly />
            </el-col>
            <el-col class="line" :span="2" style="text-align: center; color:red;cursor: pointer;"><span @click="sccdcq(index)">删除</span></el-col>
          </el-form-item>
        </template>
        <el-form-item label="场区场地：">
          <el-col :span="8">
            <el-select
              v-model="cqcqObj.cq"
              placeholder="请选择场区"
              style="width: 100%"
              @change="getSpaceList(cqcqObj.cq)"
            >
              <el-option
                v-for="item in cqList"
                :key="item.id"
                :label="item.areaName"
                :value="item.id"
              />
            </el-select>
          </el-col>
          <el-col class="line" :span="1" style="text-align: center">-</el-col>
          <el-col :span="8">
            <el-select
              v-model="cqcqObj.cd"
              placeholder="请选择场地"
              style="width: 100%"
            >
              <el-option
                v-for="item in cdList"
                :key="item.id"
                :label="item.siteName"
                :value="item.id"
              />
            </el-select>
          </el-col>
          <el-col class="line primaryColor pointer" :span="2" style="text-align: center;"><span @click="tjcdcq">添加</span></el-col>
        </el-form-item>
      </el-form>
      <!-- <div slot="footer" class="dialog-footer">
        <el-button @click="showCqcd = false">取消</el-button>
        <el-button v-preventReClick type="primary" @click="showCqcd = false">确定</el-button>
      </div> -->
    </el-dialog>
    <el-dialog
      title="查看定时"
      :close-on-click-modal="modalDialog"
      :close-on-press-escape="modalDialog"
      :visible.sync="showDslist"
    >
      <el-table
        :data="dsList"
        border
        fit
        :header-row-class-name="'table-header'"
        class="doumee-element-table"
      >
        <el-table-column
          align="center"
          label="灯控状态"
          prop="status"
          min-width="150"
        >
          <template slot-scope="scope">
            {{ scope.row.status == 'true'?'打开':'关闭' }}
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="定时类型"
          prop="type"
          min-width="150"
        >
          <template slot-scope="scope">
            {{ scope.row.type == '1'?'单次定时':'循环定时' }}
          </template></el-table-column>
        <el-table-column
          align="center"
          label="循环周期"
          prop="week"
          min-width="200"
          show-overflow-tooltip
        />
        <el-table-column
          align="center"
          label="开关时间"
          prop="time"
          min-width="200"
          show-overflow-tooltip
        />
        <el-table-column label="操作" align="center" width="200" fixed="right">
          <template slot-scope="scope">
            <div class="flex-cc">
              <el-button v-preventReClick type="text" @click="showBjDsBtn(scope.row)">编辑</el-button>
              <el-button v-preventReClick type="text" class="secondColor" @click="showScDsBtn(scope.row)">删除</el-button>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog
      title="编辑定时"
      :close-on-click-modal="modalDialog"
      :close-on-press-escape="modalDialog"
      :visible.sync="showBjDs"
    >
      <el-form ref="ruleFormd" :model="ds" :rules="rulec" label-width="100px">
        <el-form-item label="灯控状态：" prop="status">
          <el-radio-group v-model="ds.status">
            <el-radio label="true">开灯</el-radio>
            <el-radio label="false">关灯</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="循环周期：" prop="week">
          <el-checkbox-group v-model="ds.week" @change="handleCheckAllChange">
            <el-checkbox label="一">周一</el-checkbox>
            <el-checkbox label="二">周二</el-checkbox>
            <el-checkbox label="三">周三</el-checkbox>
            <el-checkbox label="四">周四</el-checkbox>
            <el-checkbox label="五">周五</el-checkbox>
            <el-checkbox label="六">周六</el-checkbox>
            <el-checkbox label="日">周日</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="开关时间：" prop="time">
          <el-time-picker
            v-if="ds.week.length > 0"
            v-model="ds.time"
            format="HH:mm:ss"
            value-format="HH:mm:ss"
            placeholder="选择时间"
          />
          <el-date-picker
            v-else
            v-model="ds.time"
            type="datetime"
            placeholder="选择日期时间"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            :picker-options="pickerOptions"
          />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="showBjDs = false">取消</el-button>
        <el-button v-preventReClick :loading="subLoading" type="primary" @click="onSubmitd">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { accountConfig, accountInfo, lightList, ruleConfig, ruleInfo, syncDevice, manufacturerList, manufacturerDetail, getAreaList, spaceList, controlLine, closeLight, bindInfo, bindArea, timerList, delTimer, timerSave, devLine } from '@/api'
import { parseTime } from '@/utils'
import store from '@/store'
export default {
  name: 'Devicef',
  data() {
    return {
      modalDialog: store.getters.dialog,
      subLoading: false,
      pickerOptions: {
        disabledDate(time) {
          return (
            time.getTime() < new Date(new Date().toLocaleDateString()).getTime()
          )
        }
      },
      tsList: [],
      sbList: [],
      xlList: [],
      title: '',
      tabList: [],
      functors: [],
      active: '0',
      pagination: {
        page: 1,
        rows: 10
      },
      total: 0,
      list: [],
      listLoading: true,
      openStatus: [
        { value: true, label: '开' },
        { value: false, label: '关' }
      ],
      filters: {},
      form: {},
      showZhpz: false,
      rules: {
        account: [
          { required: true, message: '请输入用户账号', trigger: 'blur' }
        ],
        appKey: [
          { required: true, message: '请输入AppKey', trigger: 'blur' }
        ],
        appSecret: [
          { required: true, message: '请输入AppSecret', trigger: 'blur' }
        ],
        facturerId: [
          { required: true, message: '请选择设备厂商', trigger: 'change' }
        ],
        passwd: [
          { required: true, message: '请输入密码', trigger: 'blur' }
        ],
        projectCode: [
          { required: true, message: '请输入projectCode', trigger: 'blur' }
        ],
        redirectUrl: [
          { required: true, message: '请输入redirectUrl', trigger: 'blur' }
        ]
      },
      showGZPZ: false,
      gzpz: {},
      ruleb: {
        kd: [
          { required: true, message: '请输入开灯提前时间', trigger: 'blur' },
          { pattern: /^([1-9]\d*|[0]{1,1})$/, message: '请输入整数时间', trigger: 'blur' }
        ],
        gd: [
          { required: true, message: '请输入关灯延迟时间', trigger: 'blur' },
          { pattern: /^([1-9]\d*|[0]{1,1})$/, message: '请输入整数时间', trigger: 'blur' }
        ]
      },
      showDs: false,
      ds: {
        week: []
      },
      rulec: {
        macId: [
          { required: true, message: '请选择设备', trigger: 'change' }
        ],
        lineId: [
          { required: true, message: '请选择线路，多选', trigger: 'change' }
        ],
        status: [
          { required: true, message: '请选择灯控状态', trigger: 'change' }
        ],
        time: [
          { required: true, message: '请选择时间', trigger: 'change' }
        ]
      },
      showCqcd: false,
      cqcd: [],
      cqcqObj: {},
      cqList: [],
      cdList: [],
      showDslist: false,
      dsList: [],
      showBjDs: false,
      lineId: ''
    }
  },
  created() {
    this.tomanufacturerList()
    this.toGetAreaList()
    this.title = this.$route.meta.title.substring(0, this.$route.meta.title.length - 2)
  },
  activated() {
    this.$refs.table.doLayout()
  },
  methods: {
    // 删除特殊配置
    delBtn(index) {
      const that = this
      this.$confirm('此操作将删除该特殊时间是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          that.tsList.splice(index, 1)
        })
        .catch(() => {
          // this.$message.info('已取消删除')
        })
    },
    getdevLine() {
      const venueId = sessionStorage.getItem('venueId')
      devLine({ param: { venueId, facturerId: this.tabList[this.active].id }}, venueId).then(res => {
        this.sbList = res.recordList || []
        this.xlList = []
      })
    },
    sbChange() {
      this.$set(this.ds, 'lineId', null)
      this.xlList = []
      this.sbList.forEach(e => {
        if (e.id === this.ds.macId) {
          this.xlList = e.lineResponseParamList
        }
      })
    },
    showBjDsBtn(e) {
      this.ds = {
        time: e.time,
        status: e.status,
        macId: e.macId,
        autoid: e.autoid,
        lineId: e.channel,
        id: e.id,
        week: e.week.split('')
      }
      this.showBjDs = true
    },
    showScDsBtn(e) {
      const venueId = sessionStorage.getItem('venueId')
      delTimer({ param: { venueId, id: e.id, facturerId: this.tabList[this.active].id, macId: e.macId, autoid: e.autoid }}, venueId).then(res => {
        if (res.errorCode === '000000') {
          this.$message.success('删除成功')
          this.showDslist = false
          this.getList(1)
          // timerList({ param: { venueId, facturerId: this.tabList[this.active].id, lineId: this.lineId, autoid: '0' }}, venueId).then(resb => {
          //   this.dsList = resb.recordList || []
          //   this.showDslist = true
          // })
        }
      })
    },
    onSubmitd() {
      // const that = this
      this.$refs.ruleFormd.validate((valid) => {
        if (valid) {
          const param = { ...this.ds }
          param.venueId = sessionStorage.getItem('venueId')
          param.facturerId = this.tabList[this.active].id
          param.week = param.week.join(',')
          this.subLoading = true
          timerSave({
            param
          }, sessionStorage.getItem('venueId')).then(res => {
            this.subLoading = false
            if (res.errorCode === '000000') {
              this.$message.success('定时设置成功')
              this.showBjDs = false
              this.showDslist = false
              this.getList(1)
            }
          }).catch(err => {
            this.subLoading = false
            console.log(err)
          })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    showTimeBtn(e) {
      const venueId = sessionStorage.getItem('venueId')
      this.lineId = e.id
      timerList({ param: { venueId, facturerId: this.tabList[this.active].id, lineId: e.id, autoid: '0' }}, venueId).then(res => {
        this.dsList = res.recordList || []
        this.showDslist = true
      })
    },
    toGetAreaList() {
      const venueId = sessionStorage.getItem('venueId')
      getAreaList({ param: { venueId }}).then(res => {
        this.cqList = res.recordList
      })
    },
    getSpaceList(id) {
      this.$set(this.cqcqObj, 'cd', '')
      this.$refs.ruleFormcq.clearValidate()
      spaceList({ param: { id }}).then(res => {
        this.cdList = res.recordList
      })
    },
    showCqcdBtn(e) {
      const venueId = sessionStorage.getItem('venueId')
      this.lineId = e.id
      bindInfo({ param: { venueId, facturerId: this.tabList[this.active].id, lineId: e.id }}, venueId).then(res => {
        this.cqcqObj = {}
        this.cqcd = res.record.bindParamList || []
        this.showCqcd = true
      })
    },
    tjcdcq() {
      if (!this.cqcqObj.cq) {
        this.$message.warning('请选择场区')
        return
      }
      if (!this.cqcqObj.cd) {
        this.$message.warning('请选择场地')
        return
      }
      const venueId = sessionStorage.getItem('venueId')
      const bindParams = this.cqcd
      bindParams.push({
        fieldId: this.cqcqObj.cq,
        placeId: this.cqcqObj.cd
      })
      bindArea({ param: { venueId, facturerId: this.tabList[this.active].id, bindParams, lineId: this.lineId }}, venueId).then(res => {
        if (res.errorCode === '000000') {
          this.getList(1)
          bindInfo({ param: { venueId, facturerId: this.tabList[this.active].id, lineId: this.lineId }}, venueId).then(res => {
            this.cqcqObj = {}
            this.cqcd = res.record.bindParamList || []
            this.showCqcd = true
          })
        }
      })
    },
    sccdcq(index) {
      const bindParams = [...this.cqcd]
      const venueId = sessionStorage.getItem('venueId')
      bindParams.splice(index, 1)
      bindArea({ param: { venueId, facturerId: this.tabList[this.active].id, bindParams, lineId: this.lineId }}, venueId).then(res => {
        if (res.errorCode === '000000') {
          this.$message.success('删除成功')
          this.getList(1)
          bindInfo({ param: { venueId, facturerId: this.tabList[this.active].id, lineId: this.lineId }}, venueId).then(res => {
            this.cqcqObj = {}
            this.cqcd = res.record.bindParamList || []
            this.showCqcd = true
          })
        }
      })
    },
    showDsBtn() {
      this.showDs = true
      this.getdevLine()
      this.ds = { week: [] }
    },
    onSubmitc() {
      // const that = this
      this.$refs.ruleFormc.validate((valid) => {
        if (valid) {
          const param = { ...this.ds }
          param.autoid = '0'
          param.venueId = sessionStorage.getItem('venueId')
          param.facturerId = this.tabList[this.active].id
          param.lineId = param.lineId.join(',')
          param.week = param.week.join(',')
          this.subLoading = true
          timerSave({
            param
          }, sessionStorage.getItem('venueId'))
            .then(res => {
              this.subLoading = false
              if (res.errorCode === '000000') {
                this.$message.success('定时设置成功')
                this.showDs = false
              }
            })
            .catch(err => {
              this.subLoading = false
              console.log(err)
            })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    handleCheckAllChange() {
      // this.$set(this.ds, 'time', '')
    },
    showGzpzBtn() {
      this.showGZPZ = true
      ruleInfo({
        param: {
          facturerId: this.tabList[this.active].id,
          venueId: sessionStorage.getItem('venueId')
        }
      },
      sessionStorage.getItem('venueId')
      )
        .then(res => {
          if (res.errorCode === '000000') {
            if (res.record.ruleParams) {
              const arr = res.record.ruleParams
              this.$set(this.gzpz, 'isOpen', res.record.isOpen)
              arr.forEach(e => {
                if (e.type === '0') {
                  this.$set(this.gzpz, 'kd', e.time)
                } else {
                  this.$set(this.gzpz, 'gd', e.time)
                }
              })
            } else {
              this.gzpz = {}
            }
            this.tsList = []
            if (res.record.ruleTimeParams && res.record.ruleTimeParams.length > 0) {
              const arr = res.record.ruleTimeParams
              let time = []
              arr.forEach(e => {
                if (e.startDate && e.endDate) {
                  time = [e.startDate, e.endDate]
                } else {
                  time = []
                }
                this.tsList.push({
                  areaId: e.areaId,
                  time: time
                })
              })
            }
            this.$refs.ruleFormb.clearValidate()
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    handleSizeChange(value) {
      this.pagination.rows = value
      this.getList(1)
    },
    onSubmitb() {
      // const that = this
      this.$refs.ruleFormb.validate((valid) => {
        if (valid) {
          const param = {}
          param.isOpen = this.gzpz.isOpen
          const ruleTimeParams = []
          param.ruleParams = [{
            status: '1',
            time: this.gzpz.kd,
            type: '0'
          }, {
            status: '0',
            time: this.gzpz.gd,
            type: '1'
          }]
          const tsList = this.tsList
          let pd = false
          tsList.forEach(e => {
            if (!e.areaId) {
              pd = true
              return this.$message.info('请选择场区')
            } else if (!e.time || e.time.length < 2) {
              pd = true
              return this.$message.info('请选择时间段')
            } else {
              ruleTimeParams.push({
                areaId: e.areaId,
                endDate: e.time[1],
                startDate: e.time[0]
              })
            }
          })
          if (pd) {
            return false
          }
          param.ruleTimeParams = ruleTimeParams
          param.venueId = sessionStorage.getItem('venueId')
          param.facturerId = this.tabList[this.active].id
          this.subLoading = true
          ruleConfig({
            param
          }).then(res => {
            this.subLoading = false
            if (res.errorCode === '000000') {
              this.$message.success('规则配置成功')
              this.showGZPZ = false
            }
          }).catch(err => {
            this.subLoading = false
            console.log(err)
          })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    onSubmit() {
      // const that = this
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          const param = this.form
          param.venueId = sessionStorage.getItem('venueId')
          param.facturerId = Number(param.facturerId)
          this.subLoading = true
          accountConfig({
            param
          }).then(res => {
            this.subLoading = false
            if (res.errorCode === '000000') {
              this.$message.success('账号配置成功')
              this.showZhpz = false
            }
          }).catch(err => {
            this.subLoading = false
            console.log(err)
          })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    tbBtn() {
      syncDevice({ param: { facturerId: this.tabList[this.active].id, venueId: sessionStorage.getItem('venueId') }}, sessionStorage.getItem('venueId')).then(res => {
        if (res.errorCode === '000000') { this.getList(1) }
      }).catch(err => {
        console.log(err)
      })
    },
    showZhpzBtn() {
      this.showZhpz = true
      accountInfo({ param: { facturerId: this.tabList[this.active].id, venueId: sessionStorage.getItem('venueId') }}, sessionStorage.getItem('venueId')).then(res => {
        if (res.errorCode === '000000') {
          this.form = { ...res.record, facturerId: this.tabList[this.active].id }
          // this.form.facturerId
          if (res.record.facturerId) { this.$set(this.form, 'facturerId', Number(res.record.facturerId)) }
          this.$refs.ruleForm.clearValidate()
        }
      }).catch(err => {
        console.log(err)
      })
    },
    handleClick(e) {
      this.getList(1)
    },
    clearList() {
      this.filters = {}
      this.getList(1)
    },
    getList(page) {
      const { filters, pagination } = this
      const venueId = sessionStorage.getItem('venueId')
      if (page) {
        pagination.page = page
        this.pagination.page = page
      }
      pagination.firstQueryTime = parseTime(new Date())
      this.listLoading = true
      lightList({ pagination, param: { venueId, facturerId: this.tabList[this.active].id, ...filters }}, sessionStorage.getItem('venueId')).then(res => {
        this.listLoading = false
        if (res.errorCode === '000000') {
          this.list = res.recordList
          this.total = res.totalCount
        }
      }).catch(() => {
        this.listLoading = false
      })
    },
    tomanufacturerList() {
      manufacturerList({ param: { type: '5' }}, sessionStorage.getItem('venueId')).then(res => {
        this.tabList = res.recordList
        this.functors = res.recordList[0].functors || []
        this.getList(1)
      }).catch(err => {
        console.log(err)
      })
    },
    manufacturerDetail() {
      manufacturerDetail({ param: { manufacturerId: this.tabList[this.active].id }}, sessionStorage.getItem('venueId')).then(res => {
        if (res.errorCode === '000000') {
          const cont = res.record.manufacturer + res.record.text.replace(/\n/g, '<br/>')
          this.$alert(cont, '厂商说明', {
            dangerouslyUseHTMLString: true
          })
        }
      }).catch(err => {
        console.log(err)
      })
    },
    toConfigUpdate(a, b) {
      const venueId = sessionStorage.getItem('venueId')
      this.listLoading = true
      controlLine({
        param: {
          facturerId: this.tabList[this.active].id,
          lineId: b.id,
          status: a === 'true' ? '0' : '1',
          venueId
        }
      }, venueId)
        .then(res => {
          this.listLoading = false
          if (res.errorCode === '000000') {
            this.$message.success('修改成功')
          }
          this.getList()
        })
        .catch(() => {
          this.getList()
          this.listLoading = false
        })
    },
    yjgd() {
      const venueId = sessionStorage.getItem('venueId')
      closeLight({ param: { facturerId: this.tabList[this.active].id, venueId }}, venueId).then(res => {
        if (res.errorCode === '000000') {
          this.$message.success('修改成功')
          this.getList(1)
        }
      }).catch(err => {
        console.log(err)
      })
    }
  }
}
</script>

<style lang="scss" scoped>
@import '@/styles/variables.scss';
.tsPz {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.addBtn {
  color: $primaryColor;
  line-height: 1;
  margin-top: 20px;
  cursor: pointer;
}
</style>
